<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('付款')" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form id="form-detail-edit" style="font-size: 15px">
            <div class="form-group">
                <label class="col-xs-4 control-label text-right">客户姓名：</label>
                <div class="col-xs-6 text-left">
                    <label class="text-center" th:text="${hhOrder.consumerName}" id="userName"></label>
                </div>
            </div>
            <div class="form-group">
                <label>&nbsp;&nbsp;&nbsp;</label>
            </div>
            <div class="form-group">
                <label class="col-xs-4 control-label text-right">总计：</label>
                <div class="col-xs-6 text-left">
                    <label class="text-center" th:text="${hhOrder.totalMoney}" id="totalMoney"></label>
                </div>
            </div>
            <div class="form-group">
                <label>&nbsp;&nbsp;&nbsp;</label>
            </div>
            <div class="form-group">
                <label class="col-xs-4 control-label text-right">退货：</label>
                <div class="col-xs-6 text-left">
                    <label class="text-center" th:text="${hhOrder.orderType}" id="totalMoney"></label>
                </div>
            </div>
            <div class="form-group">
                <label>&nbsp;&nbsp;&nbsp;</label>
            </div>
            <div class="form-group">
                <label class="col-xs-4 control-label text-right">已付：</label>
                <div class="col-xs-6 text-left">
                    <label class="text-center" th:text="${hhOrder.orderSale}" id="totalMoney"></label>
                </div>
            </div>
            <div class="form-group">
                <label>&nbsp;&nbsp;&nbsp;</label>
            </div>
            <div class="form-group">
                <label class="col-xs-4 control-label text-right">欠款金额：</label>
                <div class="col-xs-6 text-left">
                    <label class="text-center" th:text="${hhOrder.orderDebt}" id="totalMoney"></label>
                </div>
            </div>
            <div class="form-group">
                <label>&nbsp;&nbsp;&nbsp;</label>
            </div>
            <div class="form-group">
                <label class="col-xs-4 control-label text-right">付款金额：</label>
                <div class="col-xs-4 text-left">
                    <input class="form-control" type="text" id="payMoney">
                </div>
            </div>
            <div class="form-group">
                <label>&nbsp;&nbsp;&nbsp;</label>
            </div>
            <div class="form-group">
                <div class="col-xs-6 text-right">
                    <button class="btn btn-success" type="button" onclick="payConfirm('3')"><i class="glyphicon glyphicon-yen"></i>&nbsp;全部付清</button>
                </div>
                <div class="col-xs-6 text-left">
                    <button class="btn btn-warning" type="button" onclick="payConfirm('1')"><i class="glyphicon glyphicon-yen"></i>&nbsp;暂付款</button>
                </div>
            </div>
        </form>
    </div>
    <th:block th:include="include :: footer" />
    <script th:inline="javascript">
        var hhOrder = [[${hhOrder}]];

        //确认付款
        function payConfirm(payType) {
            var payAmount = $('#payMoney').val();
            var num = /^[+-]?[0-9]+(\.[0-9]{1,2})?$/;
            if (!num.test(payAmount)) {
                $.modal.alertError("输入有误，请重新输入！");
                return false;
            }
            $.modal.confirm(hhOrder.consumerName + " 确认付款: ￥" + payAmount + " 吗?", function () {
                payPost(hhOrder.orderId, hhOrder.consumerId, payType, payAmount);
            });
        }

        //全部付清
        function payClear() {
            $.modal.confirm(hhOrder.consumerName + " 确认全部付清: ￥" + $('#totalMoney').text() + " 吗?", function () {
                payPost(hhOrder.orderId, hhOrder.consumerId, '3', '')
            });
        }

        function payPost(orderId, consumerId, payType, payAmount) {
            $.ajax({
                type: "post",
                url: ctx + "order/manage/pay",
                data: {
                    "orderId": orderId,
                    "consumerId": consumerId,
                    "payType": payType,
                    "payAmount": payAmount
                },
                success: function(result) {
                    if (result.code == 0) {
                        $.modal.alertSuccess("付款成功！");
                        setTimeout(function () {
                            var index = parent.layer.getFrameIndex(window.name);
                            parent.layer.close(index);
                        }, 500);
                    }
                }
            })
        }
    </script>
</body>
</html>